<%@ page contentType="text/html;charset=UTF-8" language="java" trimDirectiveWhitespaces="true" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="email=no">
    <title>荩美国际商城</title>
    <link href="/resources/frontcss/cart.css" rel="stylesheet">
    <script src="/resources/js/jquery-1.8.1.min.js" type="text/javascript"></script>
    <style>
        .top-cot{ width:100%; height:2.2rem; line-height:2.2rem; background:#28163d; color:#fff; text-align:center; font-size:16px;}
    </style>
</head>
<body style="background-color: #fff;overflow-x:hidden;">
<div class="top-cot">我的订单</div>
<div id="wft_ctn"></div>

    <script type="text/html" id="listTemplate">
        {{# $.each(d, function(i,data) { }}
        <div class="total-list2 clearfix"  >
            <a href="/front/user/order/detail?id={{data.id}}">
            <ul>
                <li class="good-left">
                   <img src="{{data.productImage}}">
                </li>
                <li class="good-center2" >
                    <h1 class="fl">{{data.productName}}</h1>
                    <p class="fl price">单价:<span class="single_price">{{data.productPrice}}</span>元 <i> X {{data.productNum}}</i> </p></li>
                <li class="good-wd">
                    <p class="fl price pricecolor">合计:<span class="single_price">{{data.totalMoney}}</span>元  </p>
                    <a class="db-produce">
                        {{# if(data.status=="Create"){}}
                        待支付
                        {{#  }}}
                        {{# if(data.status=="Pay"){}}
                        已支付
                        {{#  }}}
                        {{# if(data.status=="Fail"){}}
                        支付失败
                        {{#  }}}
                        {{# if(data.status=="Send"){}}
                        已发货
                        {{#  }}}
                        {{# if(data.status=="Suc"){}}
                        已完成
                        {{#  }}}
                        {{# if(data.status=="Close"){}}
                        关闭
                        {{#  }}}
                    </a>
                </li>
            </ul>
            </a>
        </div>
        {{#  }) }}

    </script>

<script type="text/javascript" src="/resources/js/laytpl.js"></script>
<script type="text/javascript">
    var _pageFlag = false;
    if(parseInt('${query.pageNo}') < parseInt('${query.pageCount}')) {
        _pageFlag = true; //有下一页
    }
    var params = {
        isToday:'${isToday}',
        pageNo: 1,
        pageSize:20
    }
    function loadData(){
        $.ajax({
            url:"/front/user/order/listData?r="+Math.random(),
            data:params,dataType:'json', type:'post',
            success:function(data){
                if(data.success) {
                    var typl = $("#listTemplate").html();
                    if(data.data.data.length==0){
                        if(data.data.pageNo==1){
                            $("#wft_ctn").append("<p  class=\"aui-padded-10\" style=\"font-size: 16px;color: #666;text-align: center\">暂时没有订单数据</p>");
                        }else{
                            $("#wft_ctn").append("<p  class=\"aui-padded-10\" style=\"font-size: 16px;color: #666;text-align: center\">没有更多数据了...</p>");
                        }
                    }else{
                        laytpl(typl).render(data.data.data, function(html) {
                            $("#wft_ctn").append(html);
                        });
                    }
                    $(".loading").addClass("loader-chanage")
                    $(".loading").fadeOut(300);
                    if (data.data.pageNo < data.data.pageTotal) {
                        _pageFlag = true;
                    }
                }
            }
        });
    }

    $(window).scroll(function () {
        if (_pageFlag) {
            if ($(document).scrollTop() >= $(document).height() - $(window).height()) {
                _pageFlag = false;
                params['pageNo'] = params['pageNo'] + 1;
                loadData();
            }
        }
    })
    loadData();
</script>
</body>
</html>